﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>BingoTouch WebApp</title>
    <meta name="viewport" content="user-scalable=no" />
    <link rel="stylesheet" href="common/jquery.mobile-1.1.0.min.css" />
    <link rel="stylesheet" href="common/BingoTouch.css" />
    <script src="common/iscroll.js"></script>
    <script src="common/jquery-1.7.1.min.js"></script>
    <script src="common/jquery.mobile-1.1.0.min.js"></script>
    <script src="common/BingoTouch.js"></script>

    <script type="text/javascript" src="scripts/common.js"></script>

<script type="text/javascript">
    BingoTouch.ready = function () {
        BingoTouch.WebView.wait(true);
        ReqGet(GetAmount, true, function (amount) {
            amount = amount.toString().split(',');
            var allMoney = amount[0]; var allAmount = amount[1]; //总量
            var comMoney = amount[2]; var comAmount = amount[3]; //补贴
            var usrMoney = amount[4]; var usrAmount = amount[5]; //会费
            if (allMoney > 0) { //总量大于0时开始显示柱型
                $('#allAmount').height(allAmount / allMoney * 200);
                if (comMoney > 0)
                    $('#comAmount').height(comAmount / comMoney * 200);
                if (usrMoney > 0)
                    $('#usrAmount').height(usrAmount / usrMoney * 200);
            }

            $('#f0').html(amount[0]);
            $('#f1').html(amount[1]);
            $('#f2').html(amount[2]);
            $('#f3').html(amount[3]);
            $('#f4').html(amount[4]);
            $('#f5').html(amount[5]);

            ReqGet(GetMonthFinance, true, function (list) {
                var strMonthFinanceList = '';
                for (var i = 0; i < list.length; i++) {
                    var obj = list[i];
                    strMonthFinanceList += '<li><div data-role="BTButton" mousedown="false" mouseup="false">' + obj.Month + '月 补贴' + obj.Subsidy + '消费' + Math.abs(obj.Consume);
                    if (obj.Excess > 0)
                        strMonthFinanceList += '使用会费' + obj.Excess;
                    strMonthFinanceList += '元</div>';
                    strMonthFinanceList += '</li>'
                }
                $('#MonthFinanceList').append(strMonthFinanceList);

                InitModule();
            });

            ReqGet(GetActivityFinanceList, true, function (list) {
                var strActivityFinanceList = '';
                for (var i = 0; i < list.length; i++) {
                    var obj = list[i];
                    strActivityFinanceList += '<li><div data-role="BTButton" data-icon="icon-list-down" icon-dir="right" mousedown="false" mouseup="false" ai="' + obj.ID + '">' + obj.StartDate + '  共' + obj.UserCount + '人/' + Math.abs(obj.Amount) + '元</div>';
                    strActivityFinanceList += '	<div class="collapse-content">载入中</div>';
                    strActivityFinanceList += '</li>'
                }

                $('#ActivityFinanceList').append(strActivityFinanceList);

                $('#ActivityFinanceList div[data-role=BTButton]').tap(function (e) {
                    var activityId = $(this).attr('ai');
                    var collapseConent = $(this).siblings('.collapse-content');

                    if (collapseConent.text() == '载入中') {
                        BingoTouch.WebView.wait(true);

                        ReqGet(GetActivityFinanceUser + activityId, true, function (list) {
                            var strContent = '<ul class="list-view">';
                            for (var i = 0; i < list.length; i++) {
                                var obj = list[i];
                                strContent += '<li><div data-role="BTButton" data-icon="icon-list-right" icon-dir="right" data-url="account.html" url-arg="' + obj.UserId + '">' + obj.Name + obj.Amount + '元</div></li>';
                            }
                            strContent += '</ul>';

                            collapseConent.html(strContent);
                            InitModule();
                            BingoTouch.WebView.wait(false);
                        });
                    }
                });


                InitModule();

                BingoTouch.WebView.wait(false);
            });
        });

    };
</script>

</head>
<body>
<div data-role="page" class="container">
    <div class="header" fixed="top">
        <div class="header-left">
            <div class="btn-back" data-role="BTButton" data-url="home.html">返回</div>
        </div>
        <h1 class="title">协会财务一览</h1>
        <div class="header-right">
            <div class="btn-primary" data-role="BTButton" id="refresh">
                <img src="demo/statics/images/icon-refresh.png" alt=""/>
            </div>
        </div>
    </div>
	<div class="content">
    	<div class="content">
        	<div class="content-inner" style="padding-top:80px;">
                <div style="margin:0 auto; width:100px; border:2px solid #999; height:200px; position:relative">
                    <div id="allAmount" style="position:absolute; bottom:0; width:100px; background-color:#141ecf"></div>
                </div>
                <h2>经费总额<span id="f0"></span>元 &nbsp;&nbsp;&nbsp;经费余额<span id="f1"></span>元</h2>
                <table border="0" cellpadding="0" cellspacing="0" width="100%">
                    <tr>
                        <td width="50%">
                <div style="margin:0 auto; width:100px; border:2px solid #999; height:200px; position:relative">
                    <div id="comAmount" style="position:absolute; bottom:0; width:100px; background-color:#07bc34"></div>
                </div>
                        </td>
                        <td width="50%">
                <div style="margin:0 auto; width:100px; border:2px solid #999; height:200px; position:relative">
                    <div id="usrAmount" style="position:absolute; bottom:0; width:100px; background-color:#a805c6"></div>
                </div>
                        
                        </td>
                    </tr>
                    <tr>
                        <td align="center">本月补贴<span id="f2"></span>元<br />补贴余额<span id="f3"></span>元</td>
                        <td align="center">会费总额<span id="f4"></span>元<br />会费余额<span id="f5"></span>元</td>
                    </tr>
                </table>

                <h2>活动费用列表</h2>
				<ul class="list-view list-collapse" id="ActivityFinanceList">
				</ul>
                			
                <h2>每月消费明细</h2>
				<ul class="list-view" id="MonthFinanceList">
				</ul>

                <br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
            </div>
        </div>
    </div>
    <!-- 底部导航 -->
	<div class="footer" fixed="bottom">			
		<div class="navbar">
			<ul class="grid-d" sonmenu="true" sonmenu-dir="top">
				<li><div data-role="BTButton" class="btn-inverse" data-icon="demo/statics/images/icon-home.png" icon-dir="top" mouseup="false" data-url="home.html">报名</div></li>
				<li><div data-role="BTButton" class="btn-inverse btn-active" data-icon="demo/statics/images/icon-list.png" icon-dir="top" mouseup="false" data-url="finance.html">财务</div></li>
				<li><div data-role="BTButton" class="btn-inverse" data-icon="demo/statics/images/icon-search.png" icon-dir="top" mouseup="false" data-url="account.html">账户</div></li>
				<li><div data-role="BTButton" class="btn-inverse" data-icon="demo/statics/images/icon-setting.png" icon-dir="top" mouseup="false" data-url="contact.html">成员</div></li>
			</ul>
		</div>
	</div>
</div>
</body>
</html>